<template>
    <div class="mians" :class="showLine?'lines':''">
       <div class="title-icon"></div>
       <div class="title-name"><slot></slot></div>
    </div>
  </template>
  <script>
  export default {
    name: 'mytitle',
    props: {
      showLine: {
        type: Boolean,
        default: false
      }
    }
  }
  </script>
  <style lang="less" scoped>
  .mians{
     width: 100%;
     
     padding-bottom: 20px;
     display: flex;
     align-items: center;
     gap: 4px;
     .title-icon{
        width: 6px;
        height: 20px;
        background: #01B780;  
     }
     .title-name{
        font-size: 20px;
        font-weight: 600;
        color: #0C131B;
     }
  }
  .lines{
    border-bottom: rgba(0,0,0,0.15) 1px solid;
  }
</style>